<template>
  <el-container v-if="isAlready">
    <el-header  style="padding-top: 0px;padding-bottom: 0px;height: 40px;background-color: #fff;border-bottom: 1px solid #e6e6e6;">
			<div class="left-panel">
					<label style="font-size: 14px;margin-left: 5px;">{{title}}</label>
			</div>
			<div class="right-panel">
				<fsButton ref="button" plain size="small" :buttons="buttons" @clickHandler="buttonHandler"></fsButton>
			</div>
		</el-header>
    <el-main style="padding: 0px;background-color: #fff;padding-top: 20px;padding-left: 20px;">
    <template #default>

          <el-row :gutter="80" style="margin-left: 0px;margin-right: 0px;">
            <el-col :lg="24">
              <el-form :model="form" :rules="button_rules" ref="dialogForm" label-width="80px" label-position="left">
                <el-form-item label="公告标题" prop="noticeName">
                  <el-input v-model="form.noticeName" clearable placeholder="公告标题"></el-input>
                </el-form-item>
                <el-form-item label="公告内容" prop="noticeContent" style="height: 300px;overflow-y: auto;" class="editorcontent">
                  <!--el-input v-model="form.noticeContent" clearable placeholder="公告内容"></el-input-->
                  <vue-ueditor-wrap ref="quillEditorRef" v-model="form.noticeContent"
                          editor-id="editor"
                          :config="editorConfig"
                          :editorDependencies="['ueditor.config.js','ueditor.all.js']"
                          />
                </el-form-item>

              </el-form>

            </el-col>
          </el-row>

          <div style="flex: auto;text-align: center;margin-bottom: 20px;">
        <el-button plain type="primary" @click="save" :loading="loading">保 存</el-button>
        <el-button plain type="warning" @click="reset" :loading="loading">重 置</el-button>

      </div>
    </template>
    </el-main>
    <template #footer>
      <div style="flex: auto;text-align: center">
        <el-button plain type="primary" @click="save" :loading="loading">保 存</el-button>
        <el-button plain type="warning" @click="reset" :loading="loading">重 置</el-button>
        <el-button plain type="info" @click="this.visible = false" :loading="loading">关 闭</el-button>
      </div>
    </template>

  </el-container>
</template>

<script>
import scIconSelect from '@/components/scIconSelect'
import ExRelTable from "@/components/exRelTable/index.vue";
import tool from "@/utils/tool";
import BaseTemplate from "@/utils/baseTemplate";
import router from "@/router";
import useTabs from "@/utils/useTabs";
//


export default {
  computed: {
  },
  emits: ['success'],
  components: {
    ExRelTable,
    scIconSelect,
  },
  props: {
    menu: {
      type: Object, default: () => {
      }
    },
  },
  data() {
    return {
      activeName: 'base',
      visible: false,
      tempFileList: [],
      serverUrl:null,
      form: {
        id: "",
        noticeName: "",
        noticeContent: "",
        pathCode: "",
        attachFile:"",
        attachFileJSON:"",
      },

      button_rules: {
        noticeName: [
          {required: true, message: "请选择公告标题", trigger: "blur"},
        ],
        noticeContent: [
          {required: true, message: "请输入公告内容", trigger: "blur"},
        ],
      },
      loading: false,
      isAlready:false,
      isCreate: false,
      oldForm: null,
      editorOptionReadOnly:{},
      title:"新增公告",
      CONTENTtype:"",
      editorConfig: {
        // 后端服务地址，后端处理参考
        // https://open-doc.modstart.com/ueditor-plus/backend.html
        serverUrl: process.env.VUE_APP_API_BASEURL+'/console/ueditor/server',
        UEDITOR_HOME_URL: '/static/UEditor/',
        UEDITOR_CORS_URL: '/static/UEditor/',
    },


    }
  },
  watch: {},
  created() {
		//如果是通过跳转过来的，标签的名称设置为跳转后的标题
    let route = router.currentRoute.value;
		if (route.meta) {
			this.title = route.meta.title;
		}
		console.log(this.$route.params.key);
		let routeParams = this.$store.state.routeParams[this.$route.params.key];
    console.log(11111);
    console.log(routeParams);
		if (routeParams) {
			if (routeParams.title) {
        this.title=routeParams.title;
			}
			if (routeParams.fixedParams) {
				if (routeParams.fixedParams.id) {
          console.log(routeParams.fixedParams.id);
					this.form.id =routeParams.fixedParams.id;
          this.getDataByQueryDto();
				}
				if (routeParams.fixedParams.id) {

				}else{
					this.isCreate = '1';
				}
			}


			this.isAlready = true;

		}
	},
  async mounted() {
    this.serverUrl = await tool.minioServerUrl();
    let minioServerUrl = await this.$TOOL.minioServerUrl();
    //console.log(minioServerUrl);
    localStorage.setItem("minioServerUrl",minioServerUrl);
    this.isAlready=true;
  },
  onLoad() {

  },
  methods: {
    //显示
    open(entity) {
      this.form = Object.assign({}, entity);
      this.oldForm = Object.assign({}, this.form);
      this.visible = true;
      this.activeName = "base";
    },
    reset() {
      this.form = Object.assign({}, this.oldForm);
		for(let ref in this.$refs){
			try {
				this.$refs[ref].refresh();
			}catch (e){
			}
		}
    },
    addDisabled(datas){
      datas.forEach(item=>{
        item.disabled = item.isEnabled !== '1';
        if(item.children){
          this.addDisabled(item.children);
        }
      })
    },
    async getDataByQueryDto() {
      console.log(this.form.id);
			//let rsp = await this.$API.system.notice.findById.post({id: this.form.id});
      let rsp = await this.$API.system.notice.findById.post({id: this.form.id});
			if (rsp.code === 2000 && rsp.data) {
        this.form=rsp.data;
        /*form: {
        id: "",
        noticeName: "",
        noticeContent: "",
        pathCode: "",
        attachFile:"",
        attachFileJSON:"",
      },
 */
			}
		},
    //保存
    async save() {
      //this.form.noticeContent=this.$refs.quillEditorRef.getContent();

      let valid = await BaseTemplate.validate(this,this.$refs.dialogForm);
      if (valid) {
        try {
          this.loading = true
          var res;
          if (this.form.id) {
            res = await this.$API.system.notice.edit.post(this.form)
          } else {
            res = await this.$API.system.notice.add.post(this.form)
          }
          if (res.code === 2000) {
            this.$message.success(this.$t("code."+res.code));
			      this.$emit('success');
            this.visible = false;
			      this.$store.dispatch("commit",this.form.entityName);
            if (!this.form.id) {
              useTabs.close();
            }
          } else {
            this.$message.warning(res.message)
          }
        } finally {
          this.loading = false
        }
      }
    },
    handleSuccess(file) {
      console.log(1122345);
console.log(file);
const data = file.data;

this.form.attachFile=data;
//数据、逻辑处理
},
beforeUpload(file) {

// this.column.fileType = "image/png";
if (this.column.fileType && (!file.type || !this.column.fileType.includes(file.type))) {
this.$message.warning({message: this.$t("common.upload_type_limit", {type: this.column.fileType})});
return false;
}
if (this.column.maxLength) {
let fileSize = this.column.maxLength * 1024 * 1024;
if (file.size >= fileSize) {
this.$message.warning({message: this.$t("common.upload_filesize_limit", {filesize: this.column.maxLength})});
return false;
}
}
return true;
},
handleExceed(file, files) {
      this.$message.warning({message: this.$t("common.upload_count_limit", {limit: files.length})});
    },
filehandleSuccess(response, uploadFile, uploadFiles) {
 console.log("handleSuccess",response,uploadFile,uploadFiles);
},
handleRemove(uploadFile, uploadFiles) {
  console.log("handleRemove",uploadFile,uploadFiles);
  this.tempFileList.push(uploadFile);
      if (this.tempFileList.length === 0) {
        this.form.attachFile = "";
      } else {
        this.form.attachFile = JSON.stringify(this.tempFileList);
      }

},async handlePictureCardPreview(uploadFile) {
	this.dialogImageUrl = this.serverUrl + uploadFile.realUrl;
		if (uploadFile.type.includes("image")) {
			this.dialogVisible = true;
		} else {
			this.$message.warning({message: this.$t("common.file_can_not_preview")});
			window.open(this.dialogImageUrl);
		}
},
async submitUpload(content) {
	let serverUrl = await tool.minioServerUrl();
let fd = new FormData();
fd.append("file", content.file);
let rsp = await this.$API.common.upload.post(fd, {});
if (rsp.code === 2000) {
  let currentFile = {
    name: content.file.name,
    type: content.file.type ? content.file.type : content.file.name.substring(content.file.name.lastIndexOf(".") + 1),
    size: content.file.size,
    realUrl: rsp.data,
    url: serverUrl + rsp.data,
  };
  if (!content.file.type.includes("image")) {
    currentFile.url = "./img/404.png";
  }

  //this.model[this.tempCode][this.model[this.tempCode].length - 1] = currentFile;
 // this.model[this.column.code] = JSON.stringify(this.model[this.tempCode]);
}
},
download(file){
this.$TOOL.file.open(file.realUrl,true,file.name);
},
  }
}
</script>

<style scoped>
h2 {
  font-size: 17px;
  color: #3c4a54;
  padding: 0 0 30px 0;
}

[data-theme="dark"] h2 {
  color: #fff;
}


</style>
